<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>分类页</title>
    <link rel="stylesheet" href="css/classify.css">
</head>
<body>
    <div class="tabbar">
        <header>
            <div class="search">
                <span>搜索鲜花、蛋糕、礼品</span>
            </div>
        </header>
        <main>
            <div class="menu">
                <ul class="mennu-item">
                    <li>
                        <span>用途</span>
                    </li>
                    <li>
                        <span>花材</span>
                    </li>
                    <li>
                        <span>类别</span>
                    </li>
                    <li>
                        <span>枝数</span>
                    </li>
                </ul>
            </div>
            <div class="content">
                <div class="banner">
                    <img src="img/classify/banner1_m.jpg.png" alt="">
                </div>
                <!-- 用途 -->
                <div class="use">
                    <span>用途</span>
                    <ul class="use-text">
                        <li><span>爱情鲜花</span></li>
                        <li><span>生日鲜花</span></li>
                        <li><span>友情鲜花</span></li>
                        <li><span>探病问候</span></li>
                        <li><span>道歉鲜花</span></li>
                        <li><span>问候长辈</span></li>
                        <li><span>感谢老师</span></li>
                        <li><span>哀思鲜花</span></li>
                        <li><span>商务鲜花</span></li>
                    </ul>
                </div>
            </div>
        </main>
        <!-- 底部导航 -->
        <ul class="bot-nav">
            <li>
                <div class="item">
                    <img src="img/classify/WechatIMG254 1.png" alt="">
                    <span>首页</span>
                </div>
            </li>
            <li>
                <div class="item">
                    <img src="img/classify/WechatIMG255 1.png" alt="">
                    <span>分类</span>
                </div>
            </li>
            <li>
                <div class="item">
                    <img src="img/classify/WechatIMG252 1.png" alt="">
                    <span>购物车</span>
                </div>
            </li>
            <li>
                <div class="item">
                    <img src="img/classify/WechatIMG253 1.png" alt="">
                    <span>我的</span>
                </div>
            </li>
        </ul>
    </div>
</body>
</html>